<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="auth" uri="http://www.jiyinit.com/authTag"%>

<div class="right-container">
    <div class="container-select text-left">
        <div class="search-input">
            <span>角色ID：</span>
            <input id="roleId" name="roleId" type="text">
        </div>
        <div class="search-input">
            <span>角色姓名：</span>
            <input id="roleName" name="roleName" type="text">
        </div>
        <auth:auth authUrl="role/getRoleForPage">
            <button id="searchBtn" class="btn btn-primary" type="button">
                <i class="fa fa-search"></i> 查询
            </button>
        </auth:auth>
    </div>
    <div class="manage-button text-left">
        <auth:auth authUrl="role/toRoleAdd">
            <button id="addBtn" class="btn btn-primary" type="button">
                <i class="fa fa-plus"></i> 新增
            </button>
        </auth:auth>

        <auth:auth authUrl="role/toRoleUpdate">
            <button id="modifyBtn" class="btn btn-primary" type="button">
                <i class="fa fa-pencil"></i> 修改
            </button>
        </auth:auth>

        <auth:auth authUrl="role/roleDelete">
            <button id="deleteBtn" class="btn btn-primary" type="button">
                <i class="fa fa-trash-o"></i> 删除
            </button>
        </auth:auth>

        <auth:auth authUrl="role/toRoleTreeUpdate">
            <button id="roleBtn" class="btn btn-primary" type="button">
                <i class="fa fa-cog"></i> 分配权限
            </button>
        </auth:auth>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <table id="grid-table"></table>
            <div id="grid-pager"></div>
        </div>
    </div>
</div>

<!-- page specific plugin scripts -->
<script src="${basePath}/plugins/jqGrid/jquery.jqGrid.min.js${VERSION}"></script>
<script src="${basePath}/plugins/jqGrid/grid.locale-cn.js${VERSION}"></script>

<!-- inline scripts related to this page -->
<script type="text/javascript">
    var pageii = null;
    jQuery(function ($) {
        CommonUtils.grid({
            url: "${basePath}/role/getRoleForPage",
            colNames: ['角色ID','角色名称', '角色描述', '创建人ID', '创建时间', '修改人ID', '修改时间'],
            colModel: [
                {name: 'roleId', index: 'roleId', key: true, width: 20, sorttype: "int"},
                {name: 'roleName', index: 'roleName', width: 50},
                {name: 'roleDescription', index: 'roleDescription', width: 80},
                {name: 'createId', index: 'createId', width: 20},
                {name: 'createTime', index: 'createTime', width: 50, formatter: CommonUtils.formateDate},
                {name: 'lastModifyId', index: 'lastModifyId', width: 20},
                {name: 'lastModifyTime', index: 'lastModifyTime', width: 50, formatter: CommonUtils.formateDate}
            ]
        });

        $("#searchBtn").click(function () {
            query();
        });

        function query() {
            var queryData = {
                "roleId": $.trim($('#roleId').val()),
                "roleName": $.trim($('#roleName').val())
            };
            $("#grid-table").jqGrid("setGridParam", {
                postData: queryData
            }
            ).trigger("reloadGrid", [{page: 1}]);
        };

     /*   var width = "80%";
        if ($(window).width() > 800){
            width = "800px";
        }*/
        $("#addBtn").click("click", function () {
            pageii = layer.open({
                title: "新增角色",
                type: 2,
                maxmin: true,
                area: ["400px", "250px"],
                content: ['${basePath}/role/toRoleAdd']
            });
        });


        $("#modifyBtn").click("click", function () {
            var rowId = $("#grid-table").jqGrid('getGridParam', 'selarrrow');
            if (rowId.length > 1 || rowId == "") {
                layer.msg("请选择一行数据进行修改！");
                return;
            }
            var rowData = $("#grid-table").jqGrid('getRowData', rowId);
            var id = rowData.roleId;

            pageii = layer.open({
                title: "修改角色",
                type: 2,
                area: ["400px", "250px"],
                content: '${basePath}/role/toRoleUpdate?roleId=' + id
            });

        });

        var loading = null;
        $('#deleteBtn').click("click", function () {
            var rowsIds = $("#grid-table").jqGrid('getGridParam', 'selarrrow');
            if (rowsIds.length <= 0  || rowsIds == "") {
                layer.msg("请至少选择一行数据进行删除！");
                return;
            }
            layer.confirm('是否删除选中数据？',{ icon: 3}, function (index) {
                var roleIds = [];
                $(rowsIds).each(function () {
                    var rowData = $("#grid-table").jqGrid('getRowData', this);
                    roleIds.push(rowData.roleId);
                });
                $.ajax({
                    type: "post",
                    data: "roleIds=" + roleIds,
                    url: "${basePath}/role/roleDelete",
                    dataType: "json",
                    beforeSend:function () {
                        $('#deleteBtn').prop("disabled", true);
                        loading = layer.load(0, {
                            shade: [0.4,'#fff'] //0.4透明度的白色背景
                        });
                    },
                    success: function (data) {
                        $('#deleteBtn').prop("disabled", false);
                        layer.close(loading);
                        if (data.status == "0") {
                            layer.msg("删除成功！");
                            $("#grid-table").jqGrid().trigger("reloadGrid", [{page: 1}]);
                        }else {
                            layer.alert(data.message, {
                                icon: 0,
                                skin: 'layui-layer-lan',
                                closeBtn: 0
                            })
                        }
                    },
                    error: function(xhr, textStatus, errorThrown) {
                        $('#deleteBtn').prop("disabled", false);
                        layer.close(loading);
                    }
                });
                return false;
            });
        });



        $("#roleBtn").click("click", function () {
            var rowId = $("#grid-table").jqGrid('getGridParam', 'selarrrow');
            if (rowId.length > 1 || rowId == "") {
                layer.msg("请选择一行数据进行分配权限！");
                return;
            }
            var rowData = $("#grid-table").jqGrid('getRowData', rowId);
            var id = rowData.roleId;

            pageii = layer.open({
                title: "分配权限",
                type: 2,
                area: ["40%", "80%"],
                content: '${basePath}/role/toRoleTreeUpdate?roleId=' + id
            });

        });
    });
</script>
